package com.fanketly.musicdiary.ui.screen

import androidx.compose.animation.core.animateFloatAsState
import androidx.compose.animation.core.tween
import androidx.compose.foundation.Image
import androidx.compose.foundation.background
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.size
import androidx.compose.runtime.*
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.alpha
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.unit.dp
import androidx.navigation.NavHostController
import com.fanketly.musicdiary.R
import com.fanketly.musicdiary.navigation.MyScreen
import com.fanketly.musicdiary.ui.theme.BlackBackgroundColor
import kotlinx.coroutines.delay

@Composable
fun AnimatedSplashScreen(
    navHostController: NavHostController
) {
    var startAnimation by remember {
        mutableStateOf(false)
    }
    val alphaAnimation = animateFloatAsState(
        targetValue = if (startAnimation) 1f else 0f,
        animationSpec = tween(600)
    )
    LaunchedEffect(key1 = true, block = {
        startAnimation = true
        delay(700)
        navHostController.popBackStack()
        navHostController.navigate(MyScreen.Home.route)
    })
    SplashScreen(alpha = alphaAnimation.value)
}

@Composable
fun SplashScreen(alpha: Float) {
    Box(
        modifier = Modifier
            .fillMaxSize()
            .background(BlackBackgroundColor),
        contentAlignment = Alignment.Center
    ) {
        Image(
            modifier = Modifier
                .size(300.dp)
                .alpha(alpha),
            painter = painterResource(id = R.drawable.diary_logo),
            contentDescription = "logo"
        )
    }
}